// Declare a unique namespace.
var LuisVielva_svg_visualization;
if (typeof(LuisVielva_svg_visualization) == 'undefined')
{
	LuisVielva_svg_visualization = {};
}

// Class constructor. Parameter container is a DOM element at the client 
// that will contain the visualization.
LuisVielva_svg_visualization.PolarChart = function(container) 
{
	this.containerElement = container;
}

LuisVielva_svg_visualization.PolarChart.prototype.createSvgElement = function(tag, attribute) 
{
	var elemento = document.createElementNS("http://www.w3.org/2000/svg", tag);
	for (var k in attribute)
	{
		elemento.setAttributeNS(null, k, attribute[k]);
	}
	return elemento;
}

LuisVielva_svg_visualization.PolarChart.prototype.createSvgText = function(text, attribute)
{
	var texto = this.createSvgElement('text', attribute);
	texto.appendChild(document.createTextNode(text));
	return texto;
}

// Main drawing logic.
// Parameters:
//   data is data to display, type google.visualization.DataTable.
//   options is a name/value map of options. Our example takes one option.
LuisVielva_svg_visualization.PolarChart.prototype.draw = function(data, options) 
{
	var radius = options.radius;
	var color = options.color;
	var caption = options.caption;

        var group = this.createSvgElement('g', {transform: 'translate(' + radius + ',' + radius + ')'});
	group.appendChild(this.createSvgElement('circle', {cx: 0, cy: 0, r: radius, fill: color}));
	for (var k=0; k < 3; k++)
	{
		group.appendChild(this.createSvgElement('circle', {cx: 0, cy: 0, r: (k+1)*radius/3, fill: 'none', stroke: 'black'}));
	}
	for (var k=0; k < 4; k++)
	{
		group.appendChild(this.createSvgElement('line', {stroke: 'black', x1:0, y1:-radius, x2:0, y2: radius, transform: 'rotate(' + 45*k + ')'}));
	}
	
	if (typeof(caption) != 'undefined' && caption != null)
	{
		group.appendChild(this.createSvgText(caption, {'x': 0, 'y': 0, 'text-anchor': 'middle'}));
	}

	for (var k = 0; k < data.getNumberOfRows(); k++)
	{
		group.appendChild(this.createSvgElement('circle', {cx: data.getValue(k, 0), cy: data.getValue(k, 1), r: 3, fill: 'blue', stroke: 'none'}));	
	}

	var svgroot = this.createSvgElement('svg', {width: 2*radius, height: 2*radius});
	svgroot.appendChild(group);

	var oldroot = this.containerElement.firstChild;
	if (oldroot == null)
	{
		this.containerElement.appendChild(svgroot);
	}
	else
	{
		this.containerElement.replaceChild(svgroot, oldroot);
	}
}
